*{
    margin: 0;
    padding: 0;
}
input{
    outline: none;
}
.warpper{
    position: relative;
    width: 300px;
    margin: 20px auto;
    border: 1px solid #aaa;
    padding: 20px;
    border-radius: 5px;
}
.warpper .Input-box{
    margin: 10px;
}
.warpper .Input-box input{
    box-sizing: border-box;
     width: 270px;
     height: 40px;
     padding: 10px;
     border: 1px solid #aaa;
    border-radius: 3px;
   
}
.warpper .Input-box .stateText{
    display: none;
   color: red;
}
.warpper .show-box{
    position: relative;
    margin: 10px;
}
.warpper .show-box canvas{
    background: #aaa;
    border: 1px solid #aaa;
    border-radius: 3px;
}
.warpper .show-box .heavy{
    display: inline-block;
    height: 40px;
    line-height: 40px;
    position: absolute;
    top:0;
    right: 20px;
}
.warpper .submit{
    width: 70px;
    height: 40px;
    background: greenyellow;
     border: 1px solid #aaa;
    border-radius: 3px;
    outline: none;
    margin: 10px;
}